<template>
    <div>
        <el-dialog
          title="操作详情"
          :visible.sync="showrizhiinfo"
          width="38%"
          :show-close='false'
          >
          <el-row style="margin-bottom:30px" type="flex" justify="space-between">
              <el-col>
                  <div style="padding-left:80px">
                       用户名:{{caozuoinfo.admin_name}}
                  </div>
              </el-col>
              <el-col>
                   <el-row type="flex" justify="end">
                       <div style="padding-right:100px">
                              登录时间：{{caozuoinfo.logtime}}
                       </div>
                   </el-row> 
              </el-col>
          </el-row>
           <el-row type="flex" justify="center">
                <el-table
                  height="528"
                  :data="tableData"
                  style="width: 100%">
                  <el-table-column
                    prop="admin_name"
                    label="操作行为"
                    width="300">
                  </el-table-column>
                  <el-table-column
                    prop="logtime"
                    label="操作时间"
                    width="300">
                  </el-table-column>
                 </el-table>
           </el-row>
           <!-- //分页 -->
            <el-pagination
               @size-change="handleSizeChange"
               @current-change="handleCurrentChange"
               :page-sizes="[10, 20, 30, 50]"
               :page-size="10"
               layout="total, sizes, prev, pager, next, jumper"
               :total="400">
            </el-pagination>
          <!-- <span slot="footer" class="dialog-footer"> -->
              <el-row type="flex" justify="center">
                     <el-button    class="addbtn" @click="detbtn">关闭</el-button>
              </el-row>
          <!-- </span> -->
        </el-dialog>
       </div>
</template>
<script>
import {mapState} from "vuex"
import {getrizhiinfo } from "@/api/permission/index";
export default {
    name:'rizhiinfo',
    props:{
        showrizhiinfo:{
            type:Boolean,
            default:false
        },
        rizhiinfolist:[],
        total:0,
        fromdata:{

        }
    },
    data(){
        return {
          //管理员日志列表
            fromrizhi:{
                admin_id:this.userInfo,
                page:0,
                limit:10
            },
            tableData:[]
        }
    },
    computed:{
        ...mapState(['caozuoinfo'])
    },
    created(){
        console.log(this.caozuoinfo);
    },
    methods:{
    detbtn(){
        console.log(1);
        this.$emit('update:showrizhiinfo',false)
    },
    // 获取操作详情
    async getrizhiinfo(){
        const data = await getrizhiinfo(this.fromrizhi)
        if(data.code == 1) {
           this. tableData=data.data
        }
        console.log(data);
    },
    // 改变页码触发
    handleSizeChange(val){
        this.fromrizhi.limit = val
        this.getrizhiinfo()
    },
    //条数
     handleCurrentChange(val){
         this.fromrizhi.page = val
         this.getrizhiinfo()
     },
    },
    mounted(){
        this.fromrizhi.admin_id = this.caozuoinfo.admin_id
        this.getrizhiinfo()
    }
}
</script>
<style lang="less" scoped>
/deep/ .el-table__body-wrapper {
    overflow: hidden;
    position: relative;
    justify-content: center;
    display: flex;
}

/deep/ .el-table__header-wrapper {
    background-color: #F2F2F2;
    overflow: hidden;
    display: flex;
    justify-content: center;
}
/deep/ .el-table th.el-table__cell.is-leaf { 
     background-color: #F2F2F2;

}
</style>